<!DOCTYPE html>
<html>
<title>
	Help
</title>
<head>
	<link rel="stylesheet" href="css/topribbon2.css">
	<script type="text/javascript" src="js/jquery.min.js"></script>
</head>
<body>

<style type="text/css">
	#top_ribbon {
		width:100%;
	}
	body{
		background-color: #c9f7cf;
		margin: 40px;
	}
	h1{
		font:Roboto;
		background-color: lightyellow;
		width:100%;
	}
	article{
		background:white;
		margin:10px;
		padding: 30px;
	}
	#start_anno {
		font: 30px bold Gothic;
		text-align: center;
	}
	#start_anno:hover {
		background-color: white;
	}
</style>

<div id="top_ribbon">
    <header id="page_header">The Crowdsourced Textbook
    <script>
        $(window).scroll(function() {
            if ($(this).scrollTop() > 1){  
                $('header').addClass("sticky");
            }
            else{
                $('header').removeClass("sticky");
            }
        });
    </script>

    <div id="navbar">
        <a href="homepage.html"> HOME </a>
        <a href="help.html"> HELP </a>
        <a href="#"> ABOUT </a>
    </div>
    </header>
</div> 

<h1>Help!</h1>
<h2>Here you will find all the necessary help about using this annotation system.</h2>

<article>
<h3>Requirements</h3>
<p>Please use the latest version of your web browsers! Google Chrome and Mozilla Firefox are recommended for the best viewing experience of this website.</p>
<p>Please make sure that Javascripts are enabled in your web browser. To find about more about how to enable Javascripts, please see the Help section of your web browser</p>
</article>

<article>
<h3>User Registration</h3>
<p>Anyone can add and view annotations! You do not need to "Sign Up" to add or view annotations only.</p>
<p>As is obvious, creating a user profile has its perks: 
	<ul>
		<li>You can vote on the annotations that you are viewing! If you like an annotation, just click up-vote, else click down-vote.</li>
		<li>You can edit the annotations that you are viewing! Don't like an annotation? Simply edit it to make it a more valuable knowledge resource.</li>
	</ul>	
</p>
</article>

<article>
<h3>Adding Annotations</h3>
<p>You don't need to "Sign Up" to add annotations.</p>
<p>	
</p>
</article>
<br><br>
<div id="start_anno"><a href="main.php">Start Annotating Now!</a></div>
<br><br>
</body>
</html>